<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      /* 
      1 相同 三个技术 都可以实现 修改 this的指向 
      2 区别
        1 传递参数的写法  
      
       */

      // const obj = {
      //   name: '八戒',
      //   say(a, b) {
      //     // console.log(this.name + ' 会吃饭 ');
      //     console.log(a, b);
      //   },
      // };

      // const obj2 = {
      //   name: '悟空',
      // };

      // obj.say(); // 八戒  会吃饭

      // call 修改 this的指向

      // obj.say.call(obj2); // call 帮我们调用 say方法 指向悟空

      // apply 修改 this的指向

      // obj.say.apply(obj2); // apply 帮我们调用 say方法 指向悟空

      // bind 也会修改this指向 和 call-apply 有区别
      // call-apply 在调用的时候也会直接触发 原函数 say
      // bind 在调用的时候 不会 直接触发原函数,  但是会它会返回一个 修改了this之后的新函数
      //
      // const fn = obj.say.bind(obj2);
      // fn();

      const obj = {
        name: "八戒",
        say(a, b) {
          console.log(this.name, a, b);
        },
      };

      const obj2 = {
        name: "悟空",
      };

      // call
      // obj.say.call(obj2, 100, 200);

      // apply  传参要求  是数组 固定写法
      // obj.say.apply(obj2, [100, 200]);

      // bind
      // const fn = obj.say.bind(obj2);
      // fn(100, 200);

      const fn = obj.say.bind(obj2, 100);
      // fn();
      // const fn = obj.say.bind(obj2, 100);
      // fn(200);
    </script>
  </body>
</html>
